/**
 * 匠言知识付费v2.0.0
 * Author: 山西匠言网络科技有限公司
 * 这不是一个免费软件，它受限于许可条款，你可以访问https://www.zsfzxkc.cn/获取更多详细信息。
 * This is not a free software, it under the license terms, you can visit https://www.zsffzxkc.cn/ get more details.
 */
<template>
	<view class="container">
		
		<!-- poster = 海报 -->
		<view class="poster">
			<view class="img">
				<image :src="hbsrc" mode="aspectFit"></image>
			</view>
		</view>
		
		
		<view class="fenxiang">
			<text>长按海报可保存到手机或分享到朋友圈</text>
		</view>
		
		
		<!-- scroll -->
		<view class="scroll">
			<scroll-view class="scroll-list" scroll-x="true">
				<view class="scroll-list-item" v-for="(item,index) in hbs" :key="index" @click="hb_make(item,index)">
					<image :src="item" mode="aspectFill" :class="[{active:index==current}]"></image>
				</view>
			</scroll-view>
		</view>
		
		
	</view>
</template>

<script>
	import {checkUserinfo,wx_login} from '@/request/checkUserinfo'
	export default {
		data() {
			return {
				HOST_URL: uni.HOST_URL,
				hbs:[],
				current:-1,
				hbsrc:''
			};
		},
		onLoad() {
			this.get_hbs()
		},
		onShow(){
			checkUserinfo()
		},
		onShareAppMessage(res) {
			let path = getCurrentPages()
			let path_share = path[0].$page.fullPath
			let path_title = path[0].data.title
			let userinfo = uni.getStorageSync('userinfo')
			let base_set = uni.getStorageSync('base_set')
			if(userinfo.uid=='' || !userinfo.uid){
				uni.navigateTo({
					url:'../login/login'
				})
				return {
					title: '请先登录后再分享给好友',
					path: ''
				}
			}else{
				if (res.from === 'button') {
					
				}
				return {
					title: base_set.title,
					path: `${path_share}?pid=${userinfo.uid}`
				}
			}
		},
		methods:{
			get_hbs(){
				const BASE_URL = uni.BASE_URL
				uni.request({
					url: BASE_URL+'index/fenxiao/tgm',
					method:'GET',
					success:(res) =>{
						console.log(res.data);
						this.hbs=res.data.data
						this.hb_make(this.hbs[0],0)
					},
					fail:(res)=> {
						console.log(res.data);
					}
				});
			},
			hb_make(hbimg,key){
				uni.showLoading({
				    title: '加载中'
				});
				let userinfo=uni.getStorageSync('userinfo')
				this.current = key
				const BASE_URL = uni.BASE_URL
				var apptype;
				//#ifdef MP-WEIXIN
				apptype='MP-WEIXIN'
				//#endif
				//#ifdef H5
				apptype='H5'
				//#endif
				uni.request({
					url: BASE_URL+'index/fenxiao/hbhc',
					data:{
						hbimg: hbimg,
						imgkey:key,
						userid:userinfo.uid,
						apptype:apptype
					},
					method:'POST',
					success:(res) =>{
						console.log(res.data);
						this.hbsrc=res.data.data.imgpath
						uni.hideLoading()
					},
					fail:(res)=> {
						console.log(res.data);
					}
				});
			}
		}
	}
</script>

<style lang="less" scoped>
	
// 海报
.poster {
	width: 100%;
	height: 700upx;
	background-color: #313030;
	padding: 30upx 0;
	box-sizing: border-box;
	.img {
		width: 450upx;
		height: 650upx;
		// background-color: blue;
		margin: 0 auto;
		image{
			width:100%;
			height: 100%;
		}
	}
}


// 分享
.fenxiang {
	height: 100upx;
	background-color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	text {
		font-size: 32upx;
		color: #333;
	}
}



// scroll
.scroll {
	padding: 0 10upx;
	&-list {
		width: 100%;
		height: 360upx;
		white-space: nowrap;
		&-item {
			display: inline-block;
			width: 220upx;
			height: 340upx;
			margin: 0 10upx;
			// background-color: orange;
			// border-radius: 20upx;
			// box-shadow: 0 0 15upx 2upx #00BFFF;
			image{
				width: 100%;
				height: 100%;
				border-radius: 20upx;
			}
		}
		.active {
			box-shadow: 0 0 10upx 5upx #00BFFF;
		}
	}
}


</style>
